{% extends 'index.html' %}

{% block page-title %}

批量添加主机

{% endblock %}

{% block page-content %}
<div class="row">

    <div class="col-lg task_res_div">
        <form enctype="multipart/form-data" id="form1" action="#" method="post">
            <input id="uploadFile" placeholder="选择文件" disabled="disabled" />
            <div class="fileUpload btn btn-primary">
                <span>选择文件</span>
                <input id="uploadBtn" name="host_files" type="file" class="upload" multiple="multiple"/>
            </div>

        </form>
        <button type="button" onclick="Add_Hosts()" class="button black">添加</button>
        <div><span>备注：只支持导入excel格式</span></div>
        <hr style="border-color:#333;width:100%">
        <div>
                <label class="col-md-2 control-label panel-title">文件格式</label>

                <table class="table table-hover">
                    <tr>
                        <th>主机名</th>
                        <th>IP</th>
                        <th>机房</th>
                        <th>云账号</th>
                        <th>ssh端口</th>
                    </tr>
                </table>
        </div>
    </div> <!--end col-lg-9-->

</div>



<script type="text/javascript">
document.getElementById("uploadBtn").onchange = function () {
    document.getElementById("uploadFile").value = this.value;
};

function Add_Hosts(){
    var formdata=new FormData($("#form1")[0])
    console.log(formdata)
    $.ajax({
        url: "/api/multitask/hosts_add/",
        type: "POST",
        data: formdata,
        async: false,
        cache: false,
        contentType: false,
        processData: false,
        success: function(callback){
            alert(callback);
        }

    });
}

</script>
{% endblock %}
